    <div class="container" id="bar">
        <div class="row">
            <div class="
col-md-6">
                <article>
                    <h2 class="tutorial__heading">Bar Chart with Tooltip and Labels</h2>
                    <div class="js-bar-chart-tooltip-container bar-chart-tooltip-container card--chart"></div>
                </article>
            </div>
            <div class="col-md-6 sidebar">
                <h3>The code</h3>
                <pre><code class="language-javascript">
barChart
    .width(containerWidth)
    .height(300)
    .hasPercentage(true)
    .enableLabels(true)
    .labelsNumberFormat('.0%')
    .isAnimated(true)
    .on('customMouseOver', tooltip.show)
    .on('customMouseMove', tooltip.update)
    .on('customMouseOut', tooltip.hide);

barContainer.datum(dataset).call(barChart);

tooltip
    .numberFormat('.2%');

tooltipContainer = d3.select('.bar-chart .metadata-group');
tooltipContainer.datum([]).call(tooltip);
                </code></pre>

                <h4>Data Input</h4>
                <p>Check the <a href="/britecharts/global.html#BarChartData__anchor">data input schema</a> of this chart.</p>

                <h4>Export Chart</h4>
                <p>Export this chart by pressing <input class="js-download-button btn-sm btn btn-primary" type="button" value="Export" /></p>

                <h4>Demo Code</h4>
                <p>Read the whole code of this demo <a href="https://github.com/eventbrite/britecharts/blob/master/demos/src/demo-bar.js">in github</a></p>
            </div>
        </div>
        <div class="row">
            <div class="col-md-6">
                <article>
                    <h2 class="tutorial__heading">Horizontal Bar Chart</h2>
                    <div class="js-horizontal-bar-chart-container card--chart"></div>
                </article>
            </div>
            <div class="col-md-6 sidebar">
                <h3>The code</h3>
                <pre><code class="language-javascript">
barChart
    .margin({
        left: 120,
        right: 20,
        top: 20,
        bottom: 5
    })
    .percentageAxisToMaxRatio(1.3)
    .isHorizontal(true)
    .isAnimated(true)
    .colorSchema(colors.colorSchemas.britecharts)
    .width(containerWidth)
    .height(300);

barContainer.datum(dataset).call(barChart);
                </code></pre>

                <h4>Demo Code</h4>
                <p>Read the whole code of this demo <a href="https://github.com/eventbrite/britecharts/blob/master/demos/src/demo-bar.js">in github</a></p>
            </div>
        </div>
        <div class="row">
            <div class="col-md-6">
                <article>
                    <h2 class="tutorial__heading">Simple Bar Chart with labels</h2>
                    <div class="js-bar-chart-container card--chart"></div>
                </article>
            </div>
            <div class="col-md-6 sidebar">
                <h3>The code</h3>
                <pre><code class="language-javascript">
barChart
    .width(containerWidth)
    .hasPercentage(true)
    .enableLabels(true)
    .labelsNumberFormat('.0%')
    .height(300);

barContainer.datum(dataset).call(barChart);
                </code></pre>

                <h4>Demo Code</h4>
                <p>Read the whole code of this demo <a href="https://github.com/eventbrite/britecharts/blob/master/demos/src/demo-bar.js">in github</a></p>
            </div>
        </div>
        <div class="row">
            <div class="col-md-6">
                <article>
                    <a name="loading-state"></a>
                    <h2 class="tutorial__heading">Loading State</h2>
                    <div class="js-loading-container"></div>
                </article>
            </div>
            <div class="col-md-6 sidebar">
                <h3>The code</h3>
                <pre><code class="language-javascript">
barContainer.html(barChart.loadingState())
                </code></pre>

                <h4>Demo Code</h4>
                <p>Read the whole code of this demo <a href="https://github.com/eventbrite/britecharts/blob/master/demos/src/demo-bar.js">in github</a></p>
            </div>
        </div>
    </div>
